<!--
 * Copyright ©
 * #  
 * @author: zw
 * @date: 2022-02-25 
 -->


<template>
  <div style="display: inline-block; padding: 5px 0 0 5px; color:#606266">
      开始时间：<el-date-picker v-model="time[0]" :picker-options="pickerOptions1" type="date" placeholder="开始时间" size="small" />
      结束时间：<el-date-picker v-model="time[1]" :picker-options="pickerOptions2" type="date" placeholder="开始时间" size="small" />
  </div>
</template>

<script>
//  import {} from ''
export default {
  name: "picker",
  props:['time'],
  data() {
    return {
      pickerOptions1: {
        disabledDate: (time) => {
          const [,end] = this.time;// 判断结束时间是否存在，存在就约束结束时间。
          if (end && new Date(end).valueOf() < time.valueOf() ) return new Date(end).valueOf()< time.valueOf();
          return time.getTime() > Date.now();
        },
      },
      pickerOptions2: {
        disabledDate: (time) => {
          const [start] = this.time;// 判断结束时间是否存在，存在就约束结束时间。
          if (start && new Date(start).valueOf() > time.valueOf() ) return new Date(start).valueOf() > time.valueOf();
          return time.getTime() > Date.now();
        },
      },
    };
  },

  mounted() {},

  methods: {},
  //  End
};
</script>

<style lang='css' scoped>
</style>
